<template>
  <div>
    <el-row>
      <el-button size="mini" @click="openData"> 刷新 </el-button>
    </el-row>
    <div style="height: 15px"></div>
    <el-table
      :data="FObjectList"
      border
      style="height: 600px"
      highlight-current-row
      ref="myTable"
      :height="tableHeight"
    >
      <el-table-column type="index" width="50"> </el-table-column>
      <el-table-column prop="FObjectName" label="表名称"> </el-table-column>
      <el-table-column prop="FObjectType" label="表类型"> </el-table-column>
      <el-table-column prop="FObjectDescription" label="描述">
      </el-table-column>
      <el-table-column prop="FStatus" label="状态"> </el-table-column>
      <el-table-column fixed="right" label="操作">
        <template #default="scope">
          <el-button
            type="primary"
            plain
            icon="el-icon-edit"
            size="mini"
            @click="onEditObject(scope.row)"
            >编辑</el-button
          >
          <el-button
            type="warning"
            plain
            icon="el-icon-delete"
            size="mini"
            @click="onGetFieldList(scope.row)"
            >字段查看</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <el-dialog title="表编辑" v-model="FShowEdit" destroy-on-close>
      <TFormDataBaseObjectEdit
        :zContextParams="FIndexObject"
        :zContextOnCall="onEditCallBack"
      >
      </TFormDataBaseObjectEdit>
    </el-dialog>
  </div>
</template>
<script lang="ts">
import TFormBase from "@/views/BaseForm";
import TDataBaseApi, {
  TDataBaseObject,
} from "@/baselib/module/database/DataBaseApi";
import { IMenuItem } from "@/store";
import TFormDataBaseObjectEdit from "@/views/moduleSet/dataBase/DataBaseObjectEdit.vue";
import { Options } from "vue-class-component";
@Options({
  name: "TFormCmsMenu",
  components: {
    TFormDataBaseObjectEdit,
  },
})
export default class TFormDataBaseObjectList extends TFormBase {
  declare $refs: {
    myTable: any;
  };
  private tableHeight: number = 200;
  private FShowEdit: boolean = false;
  //
  private FDBCode: string = "";
  private FObjectList: TDataBaseObject[] = [];
  private FIndexObject: TDataBaseObject = new TDataBaseObject();
  public created() {
    let lTemp = this.zIndexTag?.menuParams.dbCode;
    if (typeof lTemp == "string") {
      this.FDBCode = lTemp;
    }
    if (this.$myStrHelper.stringIsEmptyYW(this.FDBCode)) {
      this.$myMsgHelp.msgDialog("数据库编码不可为空");
      return;
    }
    this.openData();
  }
  private async openData() {
    let lResult = await TDataBaseApi.GetDBObjectList(this.FDBCode);
    if (!lResult.resultSuccess) {
      this.$myMsgHelp.msgDialog(lResult.resultMsg);
      return;
    }
    this.FObjectList = lResult.resultData;
    this.$myMsgHelp.msgHintAutoClose("打开数据成功");
  }

  public mounted() {
    //自适应列表高
    this.$nextTick(() => {
      let lHeight = window.innerHeight - this.$refs.myTable.$el.offsetTop - 120;
      this.tableHeight = lHeight;
    });
    window.addEventListener("resize", () => {
      this.$nextTick(() => {
        let lHeight =
          window.innerHeight - this.$refs.myTable.$el.offsetTop - 120;
        this.tableHeight = lHeight;
      });
    });
  }

  private onGetFieldList(qRow: TDataBaseObject) {
    let lTag: IMenuItem = {
      menuIndexName: "TFormDataBaseFieldList_" + qRow.FObjectID,
      menuComponent: "TFormDataBaseFieldList",
      menuTitle: "字段参数_" + qRow.FObjectName,
      menuIcon: "",
      menuParams: { DBObject: qRow }, //参数
      menuChildren: [],
    };
    this.$myEvenBus.addTag(lTag);
  }

  private onEditObject(qRow: TDataBaseObject) {
    this.FIndexObject = qRow;
    this.FShowEdit = true;
  }

  private onEditCallBack() {
    this.FShowEdit = false;
  }
}
</script>